/* https://www.huahanlink.com/ */ 
/* 技术：小王 QQ：491813163  微信：18223904336 */
@charset "utf-8";
/* 公共响应变量 */ 
@min1901: ~"(min-width: 1901px)"; @min1581: ~"(min-width: 1581px)"; @min1261: ~"(min-width: 1261px)"; @min992: ~"(min-width: 992px)"; @min768: ~"(min-width: 768px)"; 
@max1900: ~"(max-width: 1900px)"; @max1580: ~"(max-width: 1580px)"; @max1366: ~"(max-width: 1366px)"; @max1280: ~"(max-width: 1280px)"; @max1260: ~"(max-width: 1260px)"; @max1024: ~"(max-width: 1024px)"; @max990: ~"(max-width: 990px)"; @max767: ~"(max-width: 767px)"; @max480: ~"(max-width: 480px)";
/* 初始化*/ 
* { padding: 0; margin: 0; outline: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

html { font-size: calc(100vw/19.2); -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; scrollbar-width: thin; 
    @media @min1901{ font-size:100px; } 
    @media @max1580 { font-size: calc(100vw / 21);}
    @media @max1280 { font-size: calc(100vw / 19.3); }
    @media @max767{ font-size: calc(100vw/15); } 
    @media @max480{ font-size: calc(100vw/7.5); } 
}

body { min-height: 100%; 
    font-family: "Microsoft YaHei","Microsoft YaHei UI","SimSun","SimHei","Arial"; 
    font-size:16px; color:#000; 
    background:#fff; 
    @media @max1580{ font-size:14px; }  
    @media @max767{ font-size:.28rem; } 
}
html, body { width: 100%; height: auto; margin: 0; padding: 0; position: relative; -webkit-overflow-scrolling: touch;  }
img { max-width: 100%; max-height: 100%; height: auto; box-sizing: border-box; border: 0; vertical-align: middle; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; }
ul, ol { list-style: none; }
a { text-decoration: none; color: #000; display: block; cursor: pointer; }
img { max-width: 100%; max-height: 100%; border: 0; }
h1, h2, h3, h4, h5, h6 { font-size: 120%; }
input, textarea { resize: none; }
input[type="submit"], input[type="reset"], input[type="button"], button { -webkit-appearance: none; appearance: none; }
ul.swiper-wrapper { margin: 0; padding: 0; }
/* Flex 布局 */
.flex { display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
.f_column { -webkit-box-orient: vertical; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }
.f_column_right { -webkit-box-orient: vertical; -ms-flex-direction: column-reverse; -webkit-flex-direction: column-reverse; flex-direction: column-reverse; }
.f_row { -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; -o-flex-direction: row; flex-direction: row; }
.f_row_right { -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; -o-flex-direction: row-reverse; flex-direction: row-reverse; }
.j_center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; }
.j_end { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; }
.j_start { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
.j_justify { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
.j_around { -moz-justify-content: space-around; -webkit-justify-content: space-around; justify-content: space-around; }
.a_start { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; align-items: flex-start; }
.a_end { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; align-items: flex-end; }
.a_center { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.a_baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; -webkit-align-items: baseline; align-items: baseline; }
.a_stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; -webkit-align-items: stretch; align-items: stretch; }
.a_s_stretch { -webkit-box-self: stretch; -ms-align-self: stretch; -webkit-align-self: stretch; align-self: stretch; }
.a_s_center { -webkit-box-self: center; -ms-align-self: center; -webkit-align-self: center; align-self: center; }
.a_s_end { -webkit-box-self: end; -ms-align-self: end; -webkit-align-self: end; align-self: end; }
.flex_wrap { flex-wrap: wrap; -ms-flex-wrap: wrap; }
/* 文字超出隐藏 */
.text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text(@num) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: unit(@num); overflow: hidden; }
/* 动画 */
.abImg {position: absolute;	left: 50%;	top: 50%;transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);}
.dh { -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.dh(@time) { -webkit-transition: all unit(@time, s) ease; -o-transition: all unit(@time, s) ease; transition: all unit(@time, s) ease; }
.dh_block(@time) { -webkit-transition: all unit(@time, s) ease-in-out; -o-transition: all unit(@time, s) ease-in-out; transition: all unit(@time, s) ease-in-out; }
/* 动画延迟 */
.delay(@time) { -webkit-transition-delay: unit(@time, s); -o-transition-delay: unit(@time, s); transition-delay: unit(@time, s); }
.adelay(@time) { -webkit-animation-delay: unit(@time, s); -o-animation-delay: unit(@time, s); animation-delay: unit(@time, s); }
/* 比例 */
.pb { width: 100%; height: 0; padding-bottom: 100%; position: relative; z-index: 5; overflow: hidden; }
.ab { position: absolute; left: 0; top: 0; width: 100%; height: 100%; font-size: 0; text-align: center; overflow: hidden; }
/* 图片 水平垂直 居中 */
.abimg { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); .dh }
/* 常用 CSS3 动画 */
/* 360 旋转 */
@keyframes run {0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)}}
@keyframes grow2 { 0% { transform: scale(1.2); opacity: 0.2; } 100% { transform: scale(1); opacity: 1; } }
@keyframes grow3 { 0% { transform: scale(0); opacity: 0.8; } 100% { transform: scale(1.5); opacity: 0; } }
@keyframes grow33 {
    0% {
      transform: scale(0);
      opacity: 0.8;
    }
    100% {
      transform: scale(1.5);
      opacity: 0;
    }
}

/* 旋转 */

/* 地图放大 */
@keyframes grow2 {
    0% {
      transform: scale(1) ;
      opacity: 0;
    }
    100% {
      transform: scale(1.2) ;
      opacity: 1;
    }
}
@keyframes grow3 {
    0% {
      transform: scale(1) ;
      opacity: 0.2;
    }
    100% {
      transform: scale(1.2) ;
      opacity: 1;
    }
}

@keyframes line1 {
    0% {
      stroke-dashoffset: 500;
    }
    100% {
      stroke-dashoffset: 0;
    }
}
/* 左到右移动 */
@keyframes slideLeft {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}

/* input框点击搜索时背景没有颜色 */ 
input:-webkit-autofill { background: transparent; transition: background-color 50000s ease-in-out 0s; -webkit-text-fill-color: unset; }
.xz(@size) { transform: rotate(unit(@size, deg)); -ms-transform: rotate(unit(@size, deg)); -moz-transform: rotate(unit(@size, deg)); -webkit-transform: rotate(unit(@size, deg)); -o-transform: rotate(unit(@size, deg)) }
/* 不显示滚动条 */
.scrollbar_0 { * { -ms-overflow-style: none;  /* IE and Edge */ scrollbar-width: none;  /* Firefox */ &::-webkit-scrollbar { display: none; } } }
.center_box { position: relative; z-index: 5; }
/* 垂直居中 */
.f_center{
    .flex; .a_center;.j_center;
}

/* 媒体查询 缩写 */
@max2560:~"(max-width:2560px)";@max1920:~"(max-width:1920px)";@max1840:~"(max-width:1840px)";@max1800:~"(max-width:1800px)";@max1760:~"(max-width:1760px)";@max1720:~"(max-width:1720px)";
@max1680:~"(max-width:1680px)";@max1600:~"(max-width:1600px)";@max1560:~"(max-width:1560px)";@max1520:~"(max-width:1520px)";@max1470:~"(max-width:1470px)";@max1440:~"(max-width:1440px)";
@max1400:~"(max-width:1400px)";@max1366:~"(max-width:1366px)";@max1360:~"(max-width:1360px)";@max1320:~"(max-width:1320px)";@max1280:~"(max-width:1280px)";@max1270:~"(max-width:1270px)";
@max1200:~"(max-width:1200px)";@max1150:~"(max-width:1150px)";@max1024:~"(max-width:1024px)";@max990:~"(max-width:990px)";@max768:~"(max-width:768px)";@max640:~"(max-width:640px)";
@max480:~"(max-width:480px)";@max360:~"(max-width:360px)";
/* 布局 */
.pc { display: block; }  .wap, .mobile { display: none; }
@media @max990 { .pc { display: none; } .wap, .mobile { display: block; } }
.img_cover { width: 100%; height: 100%; object-fit: cover; }
.mar_b { margin-bottom:  0 !important; } .mar_t { margin-top:  0 !important; }
.pad_b { padding-bottom: 0 !important; } .pad_t { padding-top: 0 !important; }
.h100 { height: 100%; }
.head_nbsp { width: 100%; height: var(--header-height); .dh; }

:root {
  /* COLOR */
    --active_color: #10589E; --color_fff: #ffffff; --color_text: #282828; --color_f5: #F5F5F5;
    --color_f6f: #f6f6f6; --color_f4f: #f4f4f4; --color_eee: #eeeeee;
    --color_ddd: #dddddd; --color_bbb: #bbbbbb; --color_999: #999999;--color_ccc: #cccccc;
    --color_666: #666666; --color_444: #444444; --color_333: #333333;
    --color_222: #222222; --color_000: #000000; --yellow:#F6AB00;
    /* --- font40以下 */
    --font12: clamp(12px, (0.12rem * 1), 12px); --font14: clamp(12px, (0.14rem * 1), 14px); --font16: clamp(13px, (0.16rem * 1), 16px); 
    --font17: clamp(13px, (0.17rem * 1), 17px); --font18: clamp(14px, (0.18rem * 1), 18px); --font20: clamp(15px, (0.20rem * 1), 20px); 
    --font22: clamp(16px, (0.22rem * 1), 22px); --font24: clamp(17px, (0.24rem * 1), 24px); --font26: clamp(18px, (0.26rem * 1), 26px); 
    --font28: clamp(18px, (0.28rem * 1), 28px); --font30: clamp(20px, (0.30rem * 1), 30px); --font32: clamp(20px, (0.32rem * 1), 32px); 
    --font34: clamp(22px, (0.34rem * 1), 34px); --font36: clamp(22px, (.36rem * 1), 36px); --font38: clamp(24px, (.38rem * 1), 38px); 
    /* --- font40 */
    --font40: clamp(23px, (.40rem * 1), 40px); --font42: clamp(24px, (.42rem * 1), 42px); --font44: clamp(24px, (.44rem * 1), 44px); 
    --font46: clamp(25px, (.46rem * 1), 46px); --font48: clamp(26px, (.48rem * 1), 48px); 
    /* --- font50 */
    --font50: clamp(28px, (.50rem * 1), 50px); --font52: clamp(28px, (.52rem * 1), 52px); 
    --font54: clamp(28px, (.54rem * 1), 54px); --font56: clamp(28px, (.56rem * 1), 56px); 
    --font58: clamp(29px, (.58rem * 1), 58px); 
    /* --- font60 */
    --font60: clamp(30px, (.60rem * 1), 60px); --font64: clamp(31px, (.66rem * 1), 64px);  --font66: clamp(31px, (.66rem * 1), 66px); 
    /* --- font70以及以上 */
    --font70: clamp(32px, (.70rem * 1), 70px); --font72: clamp(32px, (.72rem * 1), 72px); 
    --font80: clamp(32px, (.80rem * 1), 80px); 
    --font90: clamp(32px, (.90rem * 1), 90px); 
    --font96: clamp(32px, (.96rem * 1), 96px); 
    --font100: 1.0rem; --font120: 1.2rem;--font130: 1.3rem; --font160: 1.6rem; --font220: 2.2rem;
    --font15: clamp(12px, (0.15rem * 1), 15px); 
}

/* 公共字体 */
.font12 { font-size: var(--font12); } .font14 { font-size: var(--font14); } .font16 { font-size: var(--font16); } 
.font18 { font-size: var(--font18); } .font20 { font-size: var(--font20); } .font22 { font-size: var(--font22); }
.font24 { font-size: var(--font24); } .font26 { font-size: var(--font26); } .font28 { font-size: var(--font28); }
.font30 { font-size: var(--font30); } .font32 { font-size: var(--font32); } .font34 { font-size: var(--font34); }
.font36 { font-size: var(--font36); } .font38 { font-size: var(--font38); } .font40 { font-size: var(--font40); }
.font42 { font-size: var(--font42); } .font44 { font-size: var(--font44); } .font46 { font-size: var(--font46); }
.font48 { font-size: var(--font48); } .font50 { font-size: var(--font50); } .font52 { font-size: var(--font52); }
.font54 { font-size: var(--font54); } .font56 { font-size: var(--font56); } .font58 { font-size: var(--font58); }
.font60 { font-size: var(--font60); } .font66 { font-size: var(--font66); } .font70 { font-size: var(--font70); }
.font72 { font-size: var(--font72); } .font80 { font-size: var(--font80); } .font64 { font-size: var(--font64); }
.font100 { font-size: var(--font100); }  .font120 { font-size: var(--font120); }  .font160 { font-size: var(--font160); }
.font15 { font-size: var(--font15); }
/* 间距 */ 
.mar_t10{ margin-top: .10rem; } .mar_t13{ margin-top: .13rem; } .mar_t15{ margin-top: .15rem; } .mar_t17{ margin-top: .17rem; } 
.mar_t20{ margin-top: .20rem; } .mar_t23{ margin-top: .23rem; } .mar_t25{ margin-top: .25rem; } .mar_t27{ margin-top: .27rem; } 
.mar_t30{ margin-top: .30rem; } .mar_t33{ margin-top: .33rem; } .mar_t35{ margin-top: .35rem; } .mar_t37{ margin-top: .37rem; } 
.mar_t40{ margin-top: .40rem; } .mar_t43{ margin-top: .43rem; } .mar_t45{ margin-top: .45rem; } .mar_t47{ margin-top: .47rem; } 
.mar_t50{ margin-top: .50rem; } .mar_t53{ margin-top: .53rem; } .mar_t55{ margin-top: .55rem; } .mar_t57{ margin-top: .57rem; } 
.mar_t60{ margin-top: .60rem; } .mar_t63{ margin-top: .63rem; } .mar_t65{ margin-top: .65rem; } .mar_t67{ margin-top: .67rem; } 
.mar_t70{ margin-top: .70rem; } .mar_t73{ margin-top: .73rem; } .mar_t75{ margin-top: .75rem; } .mar_t77{ margin-top: .77rem; } 
.mar_t80{ margin-top: .80rem; } .mar_t83{ margin-top: .83rem; } .mar_t85{ margin-top: .85rem; } .mar_t87{ margin-top: .87rem; } 
.mar_t90{ margin-top: .90rem; } .mar_t93{ margin-top: .93rem; } .mar_t95{ margin-top: .95rem; } .mar_t97{ margin-top: .97rem; } 
.mar_t100{ margin-top: 1.00rem; } .mar_t105{ margin-top: 1.05rem; }
/* 文字颜色 */ 
.Coac { color: var(--active_color); }
.Co99 { color: var(--color_999); } .Co66 { color: var(--color_666); } .Co33 { color: var(--color_333); }
.Co22 { color: var(--color_222); } .Co00 { color: var(--color_000); } 
.white{color: var(--color_fff);} .activec{color: #C4131A;}
.black0{color: var(--color_000);}.black2{ color: var(--color_222);}.black3{ color: var(--color_333);}
.black6{color: var(--color_444);}.black6{color: var(--color_666);}.black9{color: var(--color_999);}
.bgblack{background-color: #010101;}
.bg5{
    background-color: #F5F5F5;
}
.activec{
    color: var(--active_color);
}
.activecbg{
    background-color: #A68045;
}
.bge{background-color: #EEE;}
/* 文字字重 */ 
.medium{font-weight: 500;}
.bold{font-weight: 700;}
.pb120{
    padding-bottom: 1.2rem;

}
.mt30{margin-top: .3rem;}
.center{text-align: center;}
/* 网格布局 */
.grid2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
}
.grid3{
    display: grid;
    grid-template-columns: repeat(3,1fr);
}
.grid4{
    display: grid;
    grid-template-columns: repeat(4,1fr);
}
.grid5{
    display: grid;
    grid-template-columns: repeat(5,1fr);
} 
.y1{
    color: var(--yellow);
}
/* 设置整个滚动条的宽度 */
::-webkit-scrollbar {
    width: 4px; /* 可以根据需要调整 */
    height: 4px;
}
  
  /* 滚动条的滑块部分 */
::-webkit-scrollbar-thumb {
    background-color: #dddddd;
    border-radius: 5px;
}

/* -------------------------------------------------------------------  layui */
.layui-laypage-next em, .layui-laypage-prev em{
    .flex; .a_center; .j_center;
}


/* --------------------------------------------------------------- 全站内容区 */
// 全屏写法 
.container { width: 100%; max-width: 98%; margin: 0 auto; }
// 内容区写法
.w1792{width: 93.33333333333333%; margin: 0 auto; 
    @media @max990 { width: 100%; padding: 0 20px; }
}

.w1760{width: 91.66666666666667%; margin: 0 auto; 
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1640 { width: 100%; max-width: 1640px; margin: 0 auto; 
    @media @max1920 { max-width: 85.416%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1620{width: 100%; max-width: 1620px; margin: 0 auto; 
    @media @max1900 { max-width: 85.26315789473684%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1520{width: 100%; max-width: 1520px; margin: 0 auto; 
    @media @max1800 { max-width: 84.44444444444444%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1480{
    width: 100%; max-width: 1480px; margin: 0 auto; 
    @media @max1760 { max-width: 91.66666666666667%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}
.w1280{
    width: 100%; max-width: 1290px; margin: 0 auto; 
    @media @max1560 { max-width: 82%; }
    @media @max990 { max-width: 100%; padding: 0 20px; }
}

.imgbg{
    .pc_img{display: block;}
    .m_img{display: none;}
    @media @max480 {
        .pc_img{display:none;}
        .m_img{display: block;}
    }
}


/* --------------------------------------------------------------- 更多按钮 */
.index_more{ width: fit-content; text-align: center;
    a{position: relative; .flex;.a_center; .j_center; color: var(--color_fff); overflow: hidden;
        padding: .1rem .32rem;
        border: 2px solid #FFFFFF;
        &:before{.dh;
            width: 0;
            position: absolute;
            content: "";
            top: 0;
            bottom: 0;
            left: -1px;
            z-index: -1;
            background-color: var(--active_color);
        }
        &:after{
            content: "";
            display: inline-block;
            background: url("../svg/more.svg") no-repeat;
            background-size: contain;
            width: 4px;
            height: 7px;
            margin-left: .13rem;
        }
        &:hover{border: 2px solid transparent;
            &:before{.dh;width: 101%;}
         
        }
    }
}
/*
插件：投递简历弹窗
版本：
官网：
*/
#hi-resume-pop {
    display: none;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    form {
        position: absolute;
        top: 50%;
        left: 50%;
        width: 34.53%;
        max-width: 663px;
         min-width: 380px;
        background: #fff;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        max-width: 663px;
        min-width: 380px;
        border-radius: 16px;
        .hi-title-box {
            position: relative;
            padding: 0 .4rem;
           
            .hi-title {
                color: var(--color_222);
                padding-top: 0.5rem;
                text-align: center;
                font-size: var(--font36);
                
               
            }
            .hi-close {
                position: absolute;
                z-index: 5;
                cursor: pointer;
                width: 0.38rem;
                height: 0.38rem;
                background: rgba(153, 153, 153, 0.2);
                border-radius: 50%;
                opacity: 1;
                top: 0.18rem;
                right: 0.18rem;
                &:before,
                &:after {
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    margin: -1px 0 0 -.13rem;
                    width: .25rem;
                    height: 2px;
                    background: #fff;
                    -webkit-transform: rotate(45deg);
                    transform: rotate(45deg);
                    .dh;
                }
                &:after {
                  -webkit-transform: rotate(-45deg);
                  transform: rotate(-45deg);
                }
                &:hover{
                    &::before{.dh;
                        background-color: var(--active_color);
                    }
                    &::after{.dh;
                        background-color: var(--active_color);
                    }
                }
            }
        }
        .hi-box {
            padding: .4rem;
            line-height: .6rem;
            .row{position: relative; z-index: 1;
                .verifyicon{
                    position: absolute;
                    right: 0.27rem;
                    top: -0.07rem;
                    width: 1.12rem;
                }
            }
            .private-btn{.flex; .a_center;
                gap: .2rem;
                .icon{
                    position: relative; z-index: 1;
                    width: .18rem;
                    height: .18rem;
                    min-width: 14px;
                    min-height: 14px;
                    border-radius: 50%;
                    border: solid 1px #333;
                    img{ display: none; position: absolute; width: 100%; height: 100%; object-fit: cover;}
                }
                .active{ border: none;
                    img{display: block;}
                }
            }
            input {
                width:100%;
                border-radius: 25px;
                border: 1px solid rgba(153, 153, 153, 0.2);
                margin-bottom: 0.2rem;
                height: 0.5rem;
                padding: 0 0.15rem;
            }
            button {
                background: var(--active_color);
                border-radius: 25px;
                margin-top: 0.2rem;
                height: 0.5rem;
                width: 100%;
                height: 0.6rem;
                color: #fff;
                cursor: pointer;
                border: 0;
                
            }
            .hi-file-box {
                display: flex;
                align-items: center;
                flex-wrap: wrap;
                margin-bottom: .2rem;
                .hi-input-box {
                    position: relative;
                    display: inline-block;
                    margin-right: .15rem;
                    padding: .05rem .15rem;
                    line-height: .3rem;
                    
                   
                    input {
                        opacity: 0;
                        position: absolute;
                        top: 0;
                        left: 0;
                        z-index: 2;
                        margin-bottom: 0;
                        padding: 0;
                        width: 100%;
                        height: 100%;
                        border: 0;
                        cursor: pointer;
                    }
                    .hi-text {
                        color: #fff;
                    }
                }
                .hi-text2 {
                    line-height: .4rem;
                  
                }
            }
            .hi-code-box {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: .2rem;
                input {
                    margin-bottom: 0;
                    width: calc(100% - 1.4rem) !important;
                  
                }
                img {
                    max-width: 1.3rem;
                    max-height: .6rem;
                    cursor: pointer;
                    
                }
            }
        }
    }
}


// --------------------------------------------- 侧边栏--通讯方式

.navbar-communication { color: var(--white-color);
    .kefu-box {
      position: fixed;
      bottom: 20%;
      right: 64px;
      z-index: 10;
      .item {position: relative;
        border-bottom: solid 1px rgba(255, 255, 255, .3);
        border-radius: 5px;
        cursor: pointer;
        .item-box {.dh;.flex; .a_center;.j_center; .white; flex-direction: column; gap: .06rem;
          overflow: hidden;
          width: .6rem;
          height: .7rem;
          background: var(--active_color);
          font-size: var(--font14);
          img { .flex; .a_center;.j_center;
            width: .22rem;
            min-width: 18px;
          }
          .st{
            width: 11px;
            height: 7px;
            min-width: auto;
          }
  
        }
        .tel{.flex;  .a_center; .j_center; .white;
          position: absolute;
          top: 50%;
          transform: translateY(-50%);
          background-color: #fff;
          height: 100%;
          padding: 0 0.3rem;
          background:var(--active_color);
          transition: all .5s ease-in-out;
          right: 0rem;
          opacity: 0;
        }
  
        .info {
          margin-right: 60px;
          width: auto;
          height: 100%;
          white-space: nowrap;
          opacity: 0;
          visibility: hidden;
          position: absolute;
          right: 0;
          top: 0;
          z-index: 1;
          transition: all 0.45s cubic-bezier(0.165, 0.84, 0.44, 1);
  
          a {
            min-width: 100px;
            height: 100%;
            display: inline-block;
            align-content: center;
  
            span {
              .flex;
              .a_center;
              .j_center;
              padding: 0 .2rem;
              height: 46px;
              background: var(--active_color);
  
              border-radius: 5px;
              color: var(--black-666);
  
            }
          }
  
          img {
            width: 1rem;
            height: 1rem;
            border: solid 2px var(--active_color);
            border-radius: 5px;
          }
        }
  
        .qrcode {
          width: auto;
          height: 100%;
          white-space: nowrap;
          opacity: 0;
          visibility: hidden;
          position: absolute;
          right: 0;
          top: -.15rem;
          z-index: 1;
          transition: all 0.45s ease-in-out;
          width: 1rem;
          height: 1rem;
          background-color: #fff;
          border: dashed 1px #eeeeee;
          
          img {
            width: 100%;
            height: 100%;
            object-fit: cover;
          }
        }
  
        .public-scrollTop {
          position: sticky;
        }
        &:hover{
          .tel{
            transition: all .5s ease-in-out;
            right: .7rem;
            opacity: 1;
          }
          .qrcode{
            right: 1rem; opacity: 1; visibility: inherit;
          }
         
        }
       
  
      }
      .scrollTop {.flex;.a_center; gap: .16rem; cursor: pointer;z-index: 2; color: var(--color_fff); 
        span{.flex;.a_center;  gap: .16rem;}
      }
    }
  
    @media @max1200 {
      display: none;
    }
}
// --------------------------------------------- 左右布局 ，移动端上下布局
.flexbox{.flex; .j_justify;width: 100%; height: auto;
    .f_left{width: auto; height: auto;}
    .f_right{width: auto; height: auto;}
    @media @max990 {
        .f_column;
        .f_left{width: 100%!important; height: auto;}
        .f_right{width: 100%!important; height: auto;margin-top: .3rem;}

    }
}
.pagination-operate{
    .flex; gap:.16rem ;z-index: 5; cursor: pointer;
    .btn{ .flex; .j_center; .a_center;
      width: .47rem;
      height: .47rem;
      min-width: 35px;
      min-height: 35px;
      border-radius: 50%;
      border: 1px solid var(--color_ddd);
      
    }
    .pre,.next{ cursor: pointer;.dh; z-index: 3;
      border: 1px solid rgb(2 5 8 / 30%);
    //   &:hover{.dh;
    //     background-color: var(--active_color); border: none;
    //     img{.dh;
    //       filter: brightness(0) invert(1);
    //     }
    //   }
    }
    .bgwhite{
      border: none;
      background-color: #fff;
    }
    @media @max990{
        display: none;
      .pre, .next{
        img{
          scale: 0.8;
        }
      }
    }
}

main { width: 100%; height: auto;  --header-height: 1.04rem;
	// &.active { --header-height: 70px; }
    @media @max990 { --header-height: 50px; }
}
/* --------------------------------------------------------------- 导航占位 */
.head_nbsp { width: 100%; height: var(--header-height); .dh; }

/* --------------------------------------------------------------- 锚点 */ 
.locate_item { width: 100%; height: 0; }
/* --------------------------------------------------------------- 全站左右结构 */ 
.box_info { width: 100%; height: auto; .flex; .j_justify; 
    @media @max990 { .f_column; gap: 0.5rem;
        .left_box , .right_box { width: 100% !important; height: auto; }
    }
}

/* --------------------------------------------------------------- 手机端轮播图分页器 */ 
.idxPageHide {.flex; .j_center; gap: 10px; display: none; gap: 5px;margin-top: 30px;
    @media @max990 {  width: 100%; height: auto; .flex; .j_center; margin-top: 20px;
        .swiper-pagination-bullet-active { background: var(--active_color); }
    }
}
.idxPageHideSpecail {.flex; .j_center; gap: 10px; display: none; gap: 5px;margin-top: 30px;
    .swiper-pagination-bullet{.dh;position: relative; z-index: 1;
        width: 68px;
        height: 4px;
        border-radius: 60px;
        background: rgba(255, 255, 255, .3);
        &:after{
            position: absolute; content: ''; width: 0; left: 0;
            height: 4px;
            border-radius: 60px;
            background: rgba(255, 255, 255, .3);
        }
    }
    .swiper-pagination-bullet-active{
        width: 96px;border-radius: 60px; z-index: 2; overflow: hidden;
        &:after{
            position: absolute; content: ''; right: 0;
            width: 96px;
            border-radius: 60px;background: #F6AB00;
            transition: all 3s ease-in-out;
            z-index: 2;
            
        }
        
    }
    @media @max990 {  width: 100%; height: auto; .flex; .j_center; gap: 10px; margin-top: 20px;
        .swiper-pagination-bullet-active { background: var(--active_color); }
    }
}

/* --------------------------------------------------------------- PC和手机端 轮播图分页器 */ 
.idxPageShow { width: 100%; height: auto; .flex; .j_center; grid-gap: var(--num_15); 
    span { width: 9px; height: 9px; }
    .swiper-pagination-bullet-active { background: var(--active_color); }
}

.img_w100 { width: 100%; height: auto; img { width: 100%; height: auto; } }
.wh100 { width: 100%; height: 100%; overflow: hidden; img { width: 100%; height: 100%; object-fit: cover; } }
.idx_more {.dh; width: fit-content; height: auto;  .flex; .a_center; .j_justify; gap: .38rem;border-radius: 60px; font-size: var(--font20);
    border: 1px solid rgba(255, 255, 255, 0.30);
    background: rgba(255, 255, 255, 0.70);
    backdrop-filter: blur(8px);padding: 4px;padding-left: .4rem;
    .word{.dh;position: relative;
        &::after{ content: '';position: absolute;bottom: 0;left: 0;width: 0;height: 1px; background-color: var(--active_color); /* 下划线的颜色 */transition: width 0.5s ease-out; /* 动画效果 */}
    }
    .icon {.dh; width: .58rem; height: .58rem; border-radius: 60px; background: var(--active_color);  .flex; .a_center; .j_center;  gap: 0.1rem; overflow: hidden;
        img{width: .12rem; height: .2rem;}
        .be{.dh;transform: translateX(-50px);}
        .hd{.dh;transform: translateX(-50%);
            margin-left: -5px;}
    }
    &:hover{.dh; color: var(--active_color);
        .word{.dh; position: relative;
            // &::after{width: 100%; }
        }
        .icon{.dh;
            .be{.dh;transform: translateX(50%);
                margin-left: 5px;}
            .hd{.dh;transform: translateX(50px);}
        }
    }
}
.idx_more2 { width: fit-content; height: auto;  .flex; .a_center; .j_justify;.dh; cursor: pointer; gap: .16rem;border-radius: 60px; font-size: var(--font20);
    .icon {  .flex; .a_center; .j_center;.dh;  gap: 0.1rem; display: block;
        img{width: .09rem; height: .15rem;}
    }
    &:hover{.dh; color: var(--yellow);
        .icon{.dh; transform: translateX(10px);}
    }   
}

.idx_title {.bold;font-size: var(--font56);}

#demo-laypage-normal-2{padding: .84rem 0;}

@keyframes lines {0% { -webkit-clip-path: inset(100% 0 0 0); clip-path: inset(100% 0 0 0); }100% {  -webkit-clip-path: inset(0 0 0 0); clip-path: inset(0 0 0 0); }}
.idSwiper { width: 100%; height: 100vh; position: fixed; z-index: 1; top: 0; left: 0; overflow: hidden;
    .swiper-wrapper { width: 100%; height: auto; 
        .swiper-slide { width: 100%; height: auto; overflow: hidden;
            &.swiper-slide-active { z-index: 2; animation: lines 0.8s linear;  }
            &.swiper-slide-prev  { opacity: 1 !important; }
        }
    }
    .idSwiCon { width: 100%; height: 100vh; overflow: hidden; }
}




.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite }
.animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s }
.animated.bounceIn, .animated.bounceOut, .animated.flipOutX, .animated.flipOutY { -webkit-animation-duration: 1s; animation-duration: 1s }
.wowInUp{ -webkit-animation-name: fadeInUp; animation-name: fadeInUp; .animated; }
.s-animate,.s-animate-up{
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
}
#fullpage { width: 100%; height: auto; position: relative; z-index: 1;
   .section { width: 100%; height: 100vh; position: absolute; top: 0; left: 0; z-index: 1; opacity: 0; .dh(.8); overflow: hidden; }
   .section.on.active { opacity: 1; z-index: 2;
        .wowUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; .animated; }
        .wowLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; .animated; }
    }
   @media @max990 {
       .section { position: relative; z-index: 1; height: auto; top: unset; left: unset; opacity: 1; }
   }
}
#fp-nav.fp-right { width: 8px; right: 11px; .dh; 
   ul li{ width: 100%; height: auto; margin: 20px 0; /*.flex; .a_end; .j_center;*/ }
   ul li a { width: 8px; height: 8px; border-radius: 50%; border: 1px solid var(--active_color); opacity: 1; .dh; }
   ul li a.active { background: var(--active_color); }
   ul li a span { display: none; }
   ul li .fp-tooltip { width: auto; right: 40px; top: 50%; transform: translateY(-50%); color: var(--active_color); opacity: 0; visibility: hidden; .dh; display: none; }
   ul li a.active ~ .fp-tooltip { right: 30px; visibility: initial; opacity: 1; }
   &.active { filter: brightness(0) invert(1); }
}

.index-more {.flex; .a_center; .j_center;
    position: relative;
    display: inline-block;
    padding: .1rem .2rem;
    text-align: center;
    font-size: 15px;
    letter-spacing: 1px;
    text-decoration: none;
    color: var(--active_color);
    background: transparent;
    cursor: pointer;
    transition: ease-out 0.5s;
    border-radius: 24px;
    border: 1px solid var(--active_color);
    box-shadow: inset 0 0 0 0 var(--active_color);
    margin-top: .6rem;
    a{.flex; .a_center; .medium; gap: .1rem;
        color: var(--active_color);
    }
    &:hover{
        color: white;
        box-shadow: inset 0 -100px 0 0 var(--active_color);
        a{color: white;}
        img{filter: brightness(0) invert(1);}
    }
    &:active{
        transform: scale(0.9);
    }
}

// .index-white{
//     border: 1px solid var(--color_fff);color: var(--color_fff);
//     a{
//         color: var(--color_fff);
//     }
//     img{filter: brightness(0) invert(1);}
//     &:hover{
//         color: white;
//         box-shadow: inset 0 -100px 0 0 var(--color_fff);
//         a{color: var(--color_333);}
//     }
// }
// .index-black{
//     background-color: var(--color_222);color: var(--color_fff);border:solid 1px var(--color_222);
//     a{
//         color: var(--color_fff);
//     }
//     img{filter: brightness(0) invert(1);}
//     &:hover{
//         .activec;
//         box-shadow: inset 0 -100px 0 0 var(--active_color);border:solid 1px var(--active_color); color: var(--color_fff);
//         img{filter: brightness(0) invert(1)}
//         a{.white;
//             img{filter: brightness(0) invert(1)}
//         }
//     }
// }
// .index-black-bor{
//     border: 1px solid var(--color_222);
//     a{
//         color: var(--color_222);
//     }
//     &:hover{
//         color: white;
//         box-shadow: inset 0 -100px 0 0 var(--color_222);
//         a{color: var(--color_fff);
//             img{filter: brightness(0) invert(1)}
//         }
//     }
// }

// .index-red{
//     background-color: var(--active_color);color: var(--color_fff);
//     a{
//         color: var(--color_fff);
//     }
//     img{filter: brightness(0) invert(1);}
//     &:hover{
//         .activec;
//         box-shadow: inset 0 -100px 0 0 var(--color_fff);
//         img{filter: inherit}
//         a{.activec;
//             img{filter: brightness(0) invert(1)}
//         }
//     }
// }
// .index-red-bor{
//     border:solid 1px var(--active_color);color: var(--active_color);
//     a{
//         color: var(--active_color);
//     }
    
//     &:hover{
//         .activec;
//         box-shadow: inset 0 -100px 0 0 var(--active_color);
//         a{
//             color: var(--color_fff);
//         }
//         img{filter: brightness(0) invert(1);}
        
//     }
// }


/* --------------------------------------------------------------- 左右按钮 */
.page-navigation{.flex;.a_center; .j_justify;
    position: absolute;
    width: calc(100% - 1.28rem);
    top: 50%;
    transform: translateY(-50%);
    z-index:2;
    left: .64rem;
    span{.flex; .a_center; .j_center;
        width: .55rem;
        height: .55rem;
        border: 1px solid rgb(255 255 255 / 20%);
        box-shadow: 0px 5px 57px 0px rgba(0,0,0,0.07);
        border-radius: 50%;
        cursor: pointer;
        &:hover{.dh;
            img{.dh;filter: brightness(0) invert(1);}
        }
    }
    
    @media @max767 {
        display: none;
    }

}
/* --------------------------------------------------------------- 动效文字 */
.ani-text-opacity {
	// display: initial;
	background: rgba(255, 255, 255, 0.3) -webkit-linear-gradient(to right, #fff, #fff) no-repeat;
	background: rgba(255, 255, 255, 0.3) linear-gradient(to right, #fff, #fff) no-repeat;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 0 100%;
	-webkit-transition: background-size cubic-bezier(.1, .5, .5, 1) 2s;
	transition: background-size cubic-bezier(.1, .5, .5, 1) 2s;
	@media @max1200 {
	  background: transparent;
	  -webkit-text-fill-color: inherit;
	  -webkit-background-clip: initial;
	}
}
.main_title{font-size: var(--font48);font-weight: 700;}
.sec_title{font-size: var(--font32);font-weight: 700;}
.main_desc{font-size: var(--font16);}

.pt-head{
    padding-top: var(--header-height);
    margin-top: .48rem;
}
.pt-head2{ padding-top: var(--header-height);}
.header_link{width: 100%; height: auto; border-bottom: solid 1px var(--color_ddd);

    .flexbox{.flex;.a_center;padding: .145rem 0;
        .f_left{font-size: var(--font24);}
        .f_right{.flex;.a_center; gap: .56rem;font-size: var(--font16);}
            .wordbox{.flex;.a_center;gap: .32rem; padding: .23rem 0;
                .item{.dh;display: block;border-bottom: solid 2px rgba(255, 255, 255, 0);
                    &:hover{.dh; .activec; border-bottom: solid 2px var(--yellow);

                    }
                }
            }
            .operatebtn{.flex;.a_center;gap: .16rem; 
                .item{padding: .16rem .4rem; display: block;border-radius: 60px;}
                .i_quote{background-color: var(--yellow);}
                .i_Contrast{.white; background-color: var(--active_color);}
            }
        }
    
}
/* --------------------------------------------------------------- 首页 */

.idx_banner{width: 100%; height: 100vh; position: relative; z-index: 1;overflow: hidden;
    .image{
        .m_img{display: none;}
    }
    .info{.center;color: var(--color_fff);z-index: 2;}
    @media @max480 {
        .image{
            .m_img{display: block;height: 400px;object-fit: cover;}
            .pc_img{display: none;}
        }
    }
}
.idx_banner1{width: 100%; height: 100vh; overflow: hidden;
    .swiper_box {
        width: 100%; height: 100%;
        ul,li{width: 100%; height: 100%;}
        .image{width: 100%; height: 100%;
            img,video{width: 100%; height: 100%; object-fit: cover;}
        }
        .info{color: var(--color_fff);position: absolute;width: 48%; text-align: left;height: 100%; top: 0;left: 0;  .flex; .a_center;
            .t0{.dh;transform: translateY(20px);text-align: left; opacity: 0; transition-delay: 1s; font-size: var(--font64);font-weight: 700;}
            .idx_more{margin-top: .64rem;}
        }
        .swiper-slide-active{
            .info{
                .t0{.dh;transform: translateY(0);opacity: 1;transition-delay: 1s}
            }
        }
    }
    .idxPageHide{position: absolute;width: 100%;bottom: 2rem; display: flex;z-index: 2;
        // .swiper-pagination-bullet{
        //     width: 68px;
        //     height: 4px;
        //     border-radius: 60px;
        //     background: #FFF;
        // }
        // .swiper-pagination-bullet-active{
        //     border-radius: 60px;
        //     background: #F6AB00;
            
        // }
    }
    .idx_form{position: absolute;width: 100%;bottom: 0; .flex; .a_center;z-index: 2;
       height: 1.6rem;background-color: rgba(255, 255, 255, 0.80);
       filter: drop-shadow(0px 12px 40px rgba(31, 95, 159, 0.06));
       backdrop-filter: blur(20px);
        .item_list{.flex; gap: .96rem; width: 81%;  height: 100%;padding-left:.64rem;padding-right:.8rem; 
            .item{
                flex:1;  .flex; .a_center; .j_center; flex-direction: column; gap:.24rem;
                .title{font-size: var(--font16); width: 100%; .flex; .a_center; .j_justify;}
                .content{width: 100%;
                    input{width: 100%; border: none; padding-bottom:.16rem ; background-color: rgba(255, 255, 255, 0); border-bottom:solid 1px rgba(0, 0, 0, 0.10);}
                }

            }
        }
        .submit{.white;.dh; width:19%; height: 100%; .flex; .a_center;.j_center; gap: .16rem; font-size: var(--font24); font-weight: 700; cursor: pointer;
            background: linear-gradient(24deg, #378FE5 -4.34%, #10589E 82.94%);
            backdrop-filter: blur(40px); border-radius: 8px 0px 0px 0px;
            .icon{width: 0.4rem; height: .4rem;}
            &:hover{.dh; color: var(--yellow);
                background: linear-gradient(24deg, #10589E -4.34%, #378FE5  82.94%);
            }
        }
    }
    @media @max1024 {
        height: 100%;
    }
    @media @max990 {
        .idx_form{display: none;}
    }
    @media @max480 {
        .swiper_box {
            .image{
                img{min-height: 500px;}
            }
            .info{width: 80%;}
            video{min-height:500px;}
            .swiper-slide-active .info .t0{font-size: var(--font30);}
        }
        .idxPageHide{bottom: .6rem;}
    }
}
.idx_banner2{
    width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .bgimg{
        .m_img{
            display: none;
        }
    }
    .info{ .white;position: absolute;width:100%;  top: 0;
        .innerbox{
            width: 37%; 
            .t0{.y1; margin-top: 1.6rem; font-size: var(--font16);}
            .t1{.bold; margin-top: .16rem; font-size: var(--font48);text-transform: uppercase;}
            .t2{margin-top: .12rem; font-size: var(--font20);
                p{opacity: 0.8;}
            }
            .t3{margin-top: .48rem;
                p{font-size: var(--font24);position: relative;padding-left: .32rem;opacity: 0.8; margin-top: .1rem;
                    &::before{
                        position: absolute;content: ''; 
                        width: 8px;
                        height: 8px;
                        background-color: var(--yellow);
                        left: 0;
                        top: 50%;
                        transform: translateY(-50%);
                    }
                }
            }
            .idx_more2{margin-top: .69rem; font-size: var(--font20);}
        }
     

    }
    @media @max768 {
        .bgimg{    position: absolute; height: 100%;
            img{width: 100%; height: 100%; object-fit: cover;}
        }
        .info{position: relative; z-index: 1; padding: 1rem 0 1.5rem 0;
            .innerbox .t0{margin-top: 0;}
        }
    }
    @media @max480 {
        .info .innerbox{width: 80%;}
    }
}
.idx_banner3{padding: .24rem;
    .innerbox{gap: .16rem;
        .item{position: relative; 
            .bgimg{
                .m_img{
                    display: none;
                }
            }
            .info{ .white;position: absolute;width:100%;  top: 0;
                .innerbox{
                    width: 70%; 
                    .t0{.y1; margin-top: .64rem; font-size: var(--font16);}
                    .t1{.bold; margin-top: .16rem; font-size: var(--font48);text-transform: uppercase;}
                    .t2{margin-top: .12rem; font-size: var(--font20);}
                    .t3{margin-top: .48rem;opacity: 0.8;
                        p{font-size: var(--font24);position: relative;padding-left: .32rem;margin-top: .1rem;
                            &::before{
                                position: absolute;content: ''; 
                                width: 8px;
                                height: 8px;
                                background-color: var(--yellow);
                                left: 0;
                                top: 50%;
                                transform: translateY(-50%);
                            }
                        }
                    }
                    .idx_more2{margin-top: .69rem; font-size: var(--font20);}
                }
             
        
            }
        }
    }
    @media @max768 {
        .innerbox .item{
            .bgimg{    position: absolute; height: 100%;
                img{width: 100%; height: 100%; object-fit: cover;}
            }
            .info{position: relative; z-index: 1; padding: .6rem 0;
                .innerbox .t0{margin-top: 0;}
            }
        }
    }
    @media @max480 {
        .innerbox {grid-template-columns: repeat(1, 1fr);
            .item .info .innerbox{width: 85%;}
        }
    }
}
.idx_solution{
    margin-top: .56rem;padding: 0 .24rem;
    .innerbox{.flex; overflow: hidden;
        .ileft{
            width: 32%; padding: .64rem; background-color: #eeeeee; border-radius: 8px 0px 0px 8px;
            .title{.bold; font-size: var(--font56);line-height: 1.2; padding-bottom: .4rem; border-bottom: solid 1px rgba(0, 0, 0, 0.1) } 
            .itemlist{
                li{.flex;.a_center; .j_justify;.dh; cursor: pointer; gap: .5rem; position: relative; font-size: var(--font24); margin: .4rem 0;
                    a{position: relative; z-index: 1;
                        &:before{.dh;
                            position: absolute;content: ''; left: -.28rem; width: 8px; height: 8px;top: 50%;transform: translateY(-50%); background: #F6AB00; opacity: 0;
                        }
                    }
                    .stit{.black9; .bold;  position: relative; max-width: 70%;
                        &:after{.dh;
                            position: absolute;content: ''; left: 0; bottom: -.04rem; width: 100%; height: 1px;background: var(--active_color); opacity: 0;
                        }
                    }
                    .more{
                        width: .12rem;
                        height: .2rem;
                        filter: brightness(0) invert(0.7);
                    }
                }
                .on{.bold;.dh; padding-left: .28rem; 
                    .stit{ color: var(--active_color); 
                        &:before{.dh;opacity: 1;}
                        &:after{.dh; opacity: 1;
                        }
                    }
                    .more{filter: inherit;}
                }
            }

        }
        .iright{
            width: 68%; border-radius: 0px 8px 8px 0px;
            .swiper_box{width: 100%; height: 100%;}
            .centerInfo{.white;
                position: absolute;width: 64%; padding: .64rem .8rem;
                .t0{.bold;font-size: var(--font40);}
                .t1{opacity: 0.8;margin-top: .16rem; font-size: var(--font16);}
                .idx_more{margin-top: .8rem;}
            }
            .imgbg{width: 100%; height: 100%;
                img{width: 100%; height: 100%; object-fit: cover;border-radius: 0px 8px 8px 0px;}
            }
        }
    }
    @media @max768 {
        .innerbox{display: inline-block;width: 100%;
            .ileft{width: 100%;}
            .iright {width: 100%;
               .swiper-slide{width: 100% !important; height: 100% !important; transform:inherit !important}
            }
        }
    }
    @media @max480 {
        .innerbox {
            .ileft{padding: 20px;}
            .iright {
                .centerInfo{
                    position: relative; z-index: 1;width: 80%;padding: .5rem 20px;
                }
                .imgbg{position: absolute;top: 0;left: 0;}
            }
        }
        }
}
.idx_case{width: calc(100% - .48rem;); height: auto; position: relative; z-index: 1; overflow: hidden; margin:.16rem .24rem ;padding-bottom: .72rem;
    .innerbox{
        .swiper_box{
            .item{
                .tag{.white; position: absolute;margin: .16rem; padding: .1rem .32rem; font-size: var(--font14); background-color: rgba(0, 0, 0, 0.2);border-radius: 60px;    z-index: 2;text-transform: capitalize;}
                .imgbg{height: 3.68rem; overflow: hidden;border-radius: 8px;
                    img{.dh;width: 100%; height: 100%; object-fit: cover;border-radius: 8px;}
                }
                .info{margin-top: .32rem;
                    .title{.dh;.text(2); font-size: var(--font24);min-height: 62px;}
                    .idx_more2{margin-top: .3rem;
                        .icon{.dh; }
                    }
                }
                &:hover{
                    .imgbg{img{.dh;scale: 1.05;}}
                    .info{
                        .title{.dh;.black0;}
                        .idx_more2{.dh;color: var(--yellow);
                            .icon{.dh; transform: translateX(-.2rem);}
                        }
                    }
                }
            }
        }
    }
}
.idx_cooperation{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding: 1.2rem 0;
    background: rgba(244, 247, 249, 0.96);
    .innerbox{
        .title{.bold;.center; width:70%;margin: auto; font-size: var(--font56); }
        .ind-news-wrap{ margin-top: .6rem;
            .company-box{ background-color: #fff; margin-top: .16rem;
                .pb{padding-bottom: 47.9%;
                    .ab{ overflow: hidden;.flex; .a_center; .j_center;
                        img{.dh; }  
                    }
                }
                .title{font-size: var(--font18);text-align: center; line-height: 1;}
                &:hover{
                    .pb{
                        .ab{border-radius: 8px;
                            border: 1px solid rgba(41, 151, 255, 0.30);
                            background: linear-gradient(330deg, #FFF 35.24%, #DBEDFF 111.51%);
                            box-shadow: 0px 16px 40px 0px rgba(16, 88, 158, 0.08);
                            img{.dh; }
                        }
                    }
                }
            }
            
        
        }
    }
    @media @max480 {.innerbox .title{width: 90%;}}
}

.idx_about{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .innerbox{
        .imgbg{position: relative;width: 100%; height: 100vh; left: 0;
            img{width: 100%; height: 100%; object-fit: cover;}
        }
        .info{.white; 
            .t_info{position: absolute;top: .96rem; width: 40%; z-index: 2; margin: auto;left: 50%;transform: translateX(-50%);text-align: center;
                .title{.bold; font-size: var(--font56);}
                .idx_more{margin: auto; margin-top: .64rem;}
            }
            .b_info{position: absolute; width:100%; left: 0; bottom: 1.2rem;  
                .itemlist{.flex;
                    .item{flex: 1; padding: 0 .8rem; position: relative; z-index: 1;
                        .num{.flex;.bold;align-items: baseline; font-size: var(--font96);
                            .y1{font-size: var(--font48);}
                        }
                        .t0{font-size: var(--font18);opacity: 0.8;}
                        &:after{
                            position: absolute; content: ''; top: .39rem; right: 0; width:1px; height: 1.07rem; background-color: rgba(255, 255, 255, 0.4);
                        }
                    }
                    .item:first-child{padding-left: 0;}
                    .item:last-child{padding-right: 0;
                        &:after{
                            display: none;
                        }
                    }
                }
                

            }

        }

    }
    @media @max1024 {
        .innerbox .imgbg{height: 100%;}
    }
    @media @max768 {
        .innerbox {
            .info {
                .t_info{width: 70%;}
                .b_info .itemlist{
                    display: grid;grid-template-columns: repeat(2,1fr); gap: .5rem;
                    .item{padding: 0;}
                    .item:nth-child(even){&::after{display: none;}}
                }
            }
            .imgbg{
                img{min-height: 550px; object-fit: cover;}
            }
        }
    }
    @media @max480 {
        .innerbox {
            .imgbg{position: absolute;}
            .info { padding: 1rem 0; 
                .t_info{position: relative; z-index: 1; top:0; left: 0; transform:none}
                .b_info {
                    position: relative; bottom: inherit; margin-top: 1rem;
                    .itemlist{
                        grid-template-columns: repeat(2, 1fr);
                    }
                }
            }
        }
    }
}
.idx_about2{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .imgbg{position: relative;width: 100%; height: 100vh; left: 0;
        img{width: 100%; height: 100%; object-fit: cover;}
    }
    .info{position: absolute;width: 100%; top: .8rem;
        .title{.bold; font-size: var(--font56);}
        .idx_more{margin-top: .64rem;}
    }
    @media @max1024 {
        .imgbg{height: 100%;}
    }
}
.idx_news{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; padding-top: 1.2rem;
    .innerbox{.flex; gap: .76rem; overflow: hidden;
        .left{width: 29.5%; overflow: hidden;
            .idx_title{width: 100%; }
            .swiper_box{margin-top: 1.3rem;width: 100%; 
                .centerInfo{background-color: #fff;width: 100%; 
                    .t0{.flex; .a_center; gap: .48rem ;.black9; font-size: var(--font16); 
                        .icon{.flex;.a_center;gap: .07rem; border-right: dashed 1px #ddd;padding-right: .24rem;
                            &:last-child{
                                border-right: none;
                            }
                        }
                       
                    }
                    .t1{.black0; margin-top: .27rem; font-size: var(--font32);}
                    .t2{.black2;font-size: var(--font14); margin-top: .16rem;}
                    .idx_more2{margin-top: .64rem;

                    }
                    .taglist{.flex; flex-wrap: wrap; gap: .08rem; margin-top: 1rem;
                        .tg{font-size: var(--font14);
                            color: var(--active_color); padding: .1rem .32rem;border-radius: 60px; background: rgb(16 88 158 / 6%);
                        }
                    }
                }
            }

        }
        .right{position: relative;width: 70.5%; height: 7.2rem; overflow: hidden;
            .img{width: 100%; height: 100%;
                img{width: 100%; height: 100%; object-fit: cover;border-radius: 8px;}
            }
            .idxPageHide {display: block; position: absolute;width: 100%; right: 0; bottom: .4rem;z-index: 2;text-align: center;}
        }
    }
    @media @max1024 {
        .innerbox .left .swiper_box{margin-top: .3rem;
            .centerInfo .taglist{margin-top: 1.2rem;}
        }
    }
    @media @max768 {
        .innerbox{display: inline-block;width: 100%;
            .left{width: 100%;}
            .right {width: 100%; margin-top: .5rem;}
        }
    }
    @media @max480 {
        padding-top: .6rem;
    }
}
.idx_newslist{width: calc(100% - .48rem;); height: auto; position: relative; z-index: 1; overflow: hidden; margin:.8rem .24rem ;
    .innerbox{
        .swiper_box{
            .item{
                .tag{.white; position: absolute;margin: .16rem; padding: .1rem .32rem; font-size: var(--font14); background-color: rgba(0, 0, 0, 0.2);border-radius: 60px;z-index: 2;}
                .imgbg{height: 3.68rem; overflow: hidden;border-radius: 8px;
                    img{.dh;width: 100%; height: 100%; object-fit: cover;border-radius: 8px;}
                }
                .info{margin-top: .32rem;
                    .title{.text(2); font-size: var(--font24);min-height: 62px;}
                    .desc{.text(3); .black2;margin-top: .12rem; font-size: var(--font14); opacity: 0.8;

                    }
                }
                &:hover{
                    .imgbg{
                        img{.dh;scale: 1.05;}
                    }
                    .info {
                        .title{.dh;color: var(--color_000); }
                        .idx_more2{.dh;;color: var(--active_color);}
                    }
                }
            }
        }
        .idx_more{
            background: rgba(238, 238, 238, 0.70);margin: auto; margin-top: .84rem;
        }
    }
    @media @max480 {
        width: 100%; padding: 20px; margin: 0;
        .innerbox{width: 100%; overflow: hidden;
            .swiper-slide{width: 100%!important;}
        }
    }
}
.idx_footer_form{width: 100%; height: 100vh; position: relative; z-index: 1; overflow: hidden; margin-top: 1.17rem;
    background: url("../images/idxform.jpg") no-repeat;
    background-size: cover;
    .imgbg{height: 100%; 
        img{position: absolute;bottom: 0;width:100%;}
        .img1{z-index: 1;animation: slideLeft 15s linear infinite;}
        .img2{z-index: 2;}
        .img3{ z-index: 2;}

    }
    .info{  position: absolute;width: 100%;  top: 1.22rem;z-index: 3;  
        .innerbox{.flex; .a_start; .j_justify; 
            .left{.white;
                width: 25%;
            }
            .right{
                width: 67%;
                /* 默认状态下兄弟元素的样式 */
                .sibling {
                    color: white; /* 默认颜色 */
                }
                
                /* 当#myInput获得焦点时，修改后续兄弟元素的样式 */
                input:focus ~ .sibling {
                    color: red; /* 改变后的颜色 */
                }
                .row{gap: .32rem;
                    /* 修改下拉框选项的背景颜色 */
                    .layui-select-title input, .layui-unselect {
                        width: 100%; 
                        background-color: rgba(255, 255, 255, 0); /* 更改为你想要的颜色 */
                    }
                    /* 修改选中项的背景颜色 */
                    .layui-select-option:hover, .layui-select-option:selected {
                        background-color: #007BFF; /* 鼠标悬停或选中时的背景颜色 */
                    }
                   
                    .layui-form-item{margin-bottom: 0;
                        .layui-input-block{margin-left: 0; width: 100%;
                            select{width: 100%;background-color: rgba(255, 255, 255, 0);color: rgba(255, 255, 255, 0.70);padding-top:.48rem; padding-bottom:.2rem; border: none; border-bottom: solid 1px rgba(255, 255, 255, 0.2); 
                                -webkit-appearance: none;-moz-appearance: none;appearance: none;background: url("../svg/select.svg") no-repeat;    background-position: 100% 70%;
                            }
                        }
                    }
                    .layui-input, .layui-textarea{
                        padding-left: 0;
                        color: #fff;
                    }
                    .item{.flex;gap:.1rem; color: rgba(255, 255, 255, 0.70);padding-top:.33rem;padding-bottom:.15rem; border: none; border-bottom: solid 1px rgba(255, 255, 255, 0.2); 
                        .layui-edge{width: 24px;
                            height: 15px;
                            background: url(../svg/select.svg) no-repeat !important;  border-top-color:rgba(255, 255, 255, 0)
                        }
                        .tag{position: absolute;color: rgba(255, 255, 255, 0.7); white-space: nowrap;height: .38rem;}
                        input{width:100%; background-color: rgba(255, 255, 255, 0); border:none; color: #fff; height: .38rem; z-index: 2;}
                        input:focus ~ .tag {
                           display: none; color: red;
                        }
                        input:focus ~ .sibling  {
                            display: none; color: red;
                        }
                    }
                    textarea{width: 100%; margin-top: .48rem;height: 1rem;border: none; background-color: rgba(255, 255, 255, 0);}
                    &:first-child{
                        .item{
                            padding-top:0;
                        }
                    }
                }
                .submitbtn{cursor: pointer; margin-top: .5rem;
                    .layui-form-checked[lay-skin=primary]>i{
                      border-color:var(--color-active) !important;
                      background-color:var(--color-active) !important;
                      &:hover{
                        border-color:var(--color-active) !important;
                      }
                    }
                  
                    .layui-form-checkbox[lay-skin=primary]>i{
                      background-color: inherit;
                        // background-color: #0c2836;
                    }
                    .layui-form-checkbox[lay-skin=primary]:hover>i{
                      border-color:var(--color-active) !important;
                    }
                    .layui-form-checkbox>div{.flex; .a_center;gap: .1rem;white-space: normal;
                       
                    }
                    
                    .layui-form-checked[lay-skin=primary] > i{
                        border-color: var(--color-active) !important;
                        background-color: var(--color-active);
                    
                    }
                    a{.white; font-size: var(--font18); }
                    
                }
                .idx_more{margin-top: .54rem;}
            }
    
        }
    }
    @media @max1280 {
        .info .innerbox .right .row textarea{height: .5rem; }
    }
    @media @max1200 {.info{top: .6rem;}}
    @media @max1024 {height: 100%;
        .info{position: relative;height: 100%;padding: 1rem 0 2rem 0;}
    }
    @media @max768{
        .info .innerbox{display: inline-block; width: 100%;  
            .left{ width: 100%;}
            .right { width: 100%; margin-top: .5rem;}
        }
    }
    @media @max480{
        .info .innerbox .right .row {grid-template-columns: repeat(1, 1fr);
            textarea{height: 1rem;}
        }
    
    }
    
}


/* --------------------------------------------------------------- 产品 */

.head_tag{.flex; .a_center;  padding: .4rem 0;
    font-size: var(--font16);
    .item{.flex; .a_center;.black9;
        a{.black9;}
    }
    .item:last-child{a{.black0}}
}
.product_wrap{ width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .innerbox{width: 100%; height: auto;
        .protab{width: 100%; height: auto;
            .swiper_box{width: 100%; height: auto; margin-top: .64rem;
                .item{width: 100%; height: auto;.flex; gap: .16rem; padding: .04rem; background-color: var(--color_eee);border-radius: 8px;
                    .pic{width: 64%; height: auto; padding:.1rem ; background-color: #fff; border-radius: 8px;
                        .pb{padding-bottom: 63.63%;
                            .ab{.flex; .a_center; .j_center;}
                        }
                    }
                    .info{width: 36%; height: auto; .white;.bold;position: relative; padding: .16rem; font-size: var(--font18);
                        .circledouble{.flex; .a_center; .j_center; width: 100%; height: auto; position: absolute; width: 24px;
                            height: 24px;    bottom: .16rem;
                            right: .16rem; border-radius: 50%; background-color: #fff;
                            &::before{position: absolute; content: ''; width: 33.33333333333333%; height: 33.33333333333333%; background-color: var(--color_eee); border-radius: 50%;}
                        }
                    }
                }
                .active{background-color: var(--active_color);
                    .info{
                        .circledouble{background-color: var(--yellow);
                            &::before{background-color: var(--active_color);}
                        }
                    }
                }
            }
        }
        .procontent{width: 100%; height: auto;margin-top: .82rem;
            .flexbox{width: 100%; height: auto; gap: .16rem;
                .f_left{width: 100%; height: auto;max-width: 4.36rem; min-width: 290px;
                    .proitem{padding: .48rem .32rem;border-radius: 8px;border: 1px solid #DDD;
                        .item{width: 100%; height: auto; margin-bottom: .56rem;
                            .title{.activec;font-size: var(--font24); padding-bottom: .24rem; border-bottom:solid 1px rgba(238, 238, 238, 0.93);}
                            .goods{width: 100%; height: auto; padding-top: .24rem; gap: .16rem;
                                .good{.flex; .a_center; gap: .16rem; cursor: pointer;
                                    .choose{.flex; .a_center; .j_center; width: .16rem; height: .16rem; border:solid 2px var(--color_ddd); border-radius: 50%;
                                        img{width: 100%; height: 100%; object-fit: contain;opacity: 0;}
                                    }
                                }
                                .active{
                                    .choose{border: none;
                                        img{opacity: 1;}
                                    }
                                }
                            }
                        }
                    }
                }
                .f_right{width: 100%; height: auto;
                    .itemlist{gap: .16rem;
                        .item{position: relative; cursor: pointer; background: url(../images/pbg.png);background-size: contain; border-radius: 8px;min-height: 4.72rem;
                            .picbox{width: 100%; height: auto;
                                .tag{.flex; .a_center; width:fit-content; position: absolute; top: .12rem; left: .12rem; height: auto;border-radius: 60px; gap: .08rem;
                                    background: var(--yellow); padding: .04rem;
                                    .perfect{.flex; .a_center; .j_center; width: .24rem; height: .24rem; background-color: #fff;
                                        border-radius: 50%;
                                    }
                                    .word{.white; font-size: 12px; padding-right:.16rem;}
                                }
                                .pic{
                                    .img{height: 2.8rem;padding: .4rem 0;min-height: 200px;
                                        img{width: 100%; height: 100%; object-fit: contain;}
                                    }
                                }
                            }
                            .info{position: absolute;width:calc( 100% - 8px); left: 4px; bottom: 4px;border-radius: 8px;background: #FFF; padding: .24rem; z-index: 6;
                                .title{.bold; font-size: var(--font24);}
                                .desc{font-size: 16px;margin-top: .1rem;}
                                .idxmore_box{.flex; .a_center; .j_justify; margin-top: .46rem;
                                    .choose{width: .24rem; height: .24rem; filter: brightness(0) invert(0.8);
                                        img{width: 100%; height: 100%; object-fit: contain;}
                                    }
                                }
                            }
                        }
                        .firstitem{grid-column: span 2; border-radius: 8px;
                            .pic{width: 100%; height: 100%;border-radius: 8px;
                                img{width: 100%; height: 100%; object-fit: cover;border-radius: 8px;}
                            }
                            .info{.white;width: 50%; top: 0; left: 0; padding-top:.5rem ; padding-left: .5rem;  background-color: rgba(255, 255, 255, 0);}
                        }
                        .active{
                            .info .idxmore_box .choose{filter: inherit;}
                        }
                    }
                }
            }
        }
    }
    .product_compare{
        .comparebox{
            .f_left{

            }
            .f_right{

            }

        }
    }
    @media @max990 {
        .innerbox .procontent .flexbox .f_left{
            min-width: 100%; min-height: 100%;
        }
    }
    @media @max480 {
        .innerbox .procontent .flexbox .f_right .itemlist {
            grid-template-columns: repeat(1, 1fr);
            .firstitem{
                grid-column: span 1;
            }
            
        }
    }
}
.prowduct_compare{width: 100%; height: auto; position: relative; z-index: 1;padding: .64rem 0; overflow: hidden; background-color: var(--active_color);
    .flexbox{width: 100%; height: auto;
        .f_left{width: 75%; gap: .16rem;
            .item{width: 100%; height: auto;.flex; gap: .16rem; padding: .04rem; background-color: var(--color_eee);border-radius: 8px;
                .pic{width: 64%; height: auto; padding:.1rem ; background-color: #eee; border-radius: 8px;
                    .pb{padding-bottom: 63.63%;
                        .ab{.flex; .a_center; .j_center;}
                    }
                }
                .info{width: 36%; height: auto; position: relative; padding: .16rem; font-size: var(--font18); background-color: #fff;
                    .word{.bold;}
                    .desc{font-size: 12px;margin-top: .1rem;}
                    .circledouble{.flex; .a_center; .j_center; 
                       
                    }
                }
            }
            .active{background-color: var(--active_color);
                .info{
                    .circledouble{background-color: var(--yellow);
                        &::before{background-color: var(--active_color);}
                    }
                }
            }
        }
        .f_right{width: 25%;
            
        }
    }
}



/* --------------------------------------------------------------- 产品规格参数 */


.product_parameters{
    .product_info_top{padding:.4rem 0 .8rem 0;
        .flexbox{gap: .76rem;
            .f_left{position: relative; width: 55%; background: url("../images/probg2.png") no-repeat;
                background-size: cover; border-radius: 8px;padding: .32rem;
                .pic{.flex; .a_center; .j_center;.f_column; width: 100%; height: 90%;overflow: hidden;}
                    ul,li{width: 100%; height: 100%;}
                    .img{.flex; .a_center; .j_center; width: 90%; height: 100%;  margin: auto;
                   
                }
                .operate{.flex; .a_center; .j_center; gap: .08rem; 
                    .item{.dh;.flex; .a_center; .black9; cursor: pointer; gap: .12rem;border-radius: 40px;
                        background: #FFF; padding: .1rem .32rem;
                        .icon{.flex; .a_center; width: .16rem; height: .16rem; min-width: 13px; min-height: 13px;
                            img{width: 100%; height: 100%; object-fit: contain;}
                        }
                        .word{.dh;.black9;}
                    }
                    .active{.dh; background: var(--active_color);
                        .icon{filter: brightness(0) invert(1)}
                        .word{.dh;.white;}
                    }
                }
                .pagination-operate{.j_justify;left: 0;padding: .32rem; width: 100%; height: auto;position: absolute;top: 50%; transform:translateY(-50%);}
            }
            .f_right{width: 45%;
                .main_title{.activec;}
                .sec_title{padding-bottom: .4rem; }
                .info{padding-top: .4rem;border-top: solid 1px var(--color_ddd);
                    .desc{font-size: var(--font16); opacity: .6;}
                    .details{margin-top: .4rem;padding-left: .3rem;
                        .dli{font-size: var(--font20);    list-style: disc; }
                    }
                    .media_icon{.flex; gap:.32rem ; margin-top: .64rem;
                        .icon{display: block; width: .5rem; height: .5rem;
                            img{width: 100%; height: 100%; object-fit: contain;}
                        }
                    }
                    .pro_operate{.flex; margin-top: .73rem;gap: .12rem;
                        .item{.f_center;  padding: .22rem .56rem; border-radius: .6rem;}
                        .i_quote{.white; background-color: var(--active_color);}
                        .i_buy{.black2; background-color: var(--yellow);}
                        .i_contrast{.white; background-color: var(--color_ccc);}
                    }
                }
            }
        }
    }
    
    .product_info_bottom{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; background-color: var(--color_f5);
       
        .specifications_list{width: 100%; height: auto; margin-top: 1.2rem;
            .innerbox{width: 100%; height: auto;margin-bottom: 1.2rem;
                .itemlist{margin-top: .64rem;  border-radius: 8px;background: #FFF; padding: 0 .64rem;
                    .item{width: 100%; height: auto; border-bottom: solid 1px var(--color_ddd); padding: .64rem 0;
                        .f_left{width: 30%;

                        }
                        .f_right{width: 70%;
                            .ps_ul{width: 100%; height: auto;
                                .ps_li{.flex; .a_center; gap: .8rem; font-size: var(--font16); padding: .16rem 0; border-bottom: dashed 1px #999;
                                   .word{.black9; width: 20%; max-width: 145px; } 
                                   .desc{.black0;width: 80%; } 
                                }
                            }
                        }

                    }
                    .item:last-child{border-bottom: none;}
                }
                .tips{.black9; margin-top: .4rem; font-size: var(--font16);}
            }
        }
    }
    .product_casestudios{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden;  background: var(--color_eee); padding: 1.2rem 0;
        .innerbox{
            .title{

            }
            .itemlist{
                .f_left{

                }
                .f_right{

                }
            }
        }
    }
    .product_related{width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden;  background: fff; padding: 1.2rem 0;
        .innerbox{width: 100%; height: auto;
            .itemlist{width: 100%; height: auto; margin-top: .64rem; gap: .16rem; overflow: hidden;
                .item{position: relative; cursor: pointer; background: url(../images/pbg.png) no-repeat;background-size: cover; border-radius: 8px;min-height: 4.72rem;min-height: 350px;
                    .picbox{width: 100%; height: auto;
                        .tag{.flex; .a_center; width:fit-content; position: absolute; top: .12rem; left: .12rem; height: auto;border-radius: 60px; gap: .08rem;
                            background: var(--yellow); padding: .04rem;
                            .perfect{.flex; .a_center; .j_center; width: .24rem; height: .24rem; background-color: #fff;
                                border-radius: 50%;
                            }
                            .word{.white; font-size: 12px; padding-right:.16rem;}
                        }
                        .pic{
                            .img{height: 2.8rem;padding: .4rem 0;min-height: 200px;
                                img{width: 100%; height: 100%; object-fit: contain;}
                            }
                        }
                    }
                    .info{position: absolute;width:calc( 100% - 8px); left: 4px; bottom: 4px;border-radius: 8px;background: #FFF; padding: .24rem; z-index: 6;
                        .title{.bold; font-size: var(--font24);}
                        .desc{.text(2); min-height: 42px; font-size: 16px;margin-top: .1rem;}
                        .idxmore_box{.flex; .a_center; .j_justify; margin-top: .46rem;
                            .choose{width: .24rem; height: .24rem; filter: brightness(0) invert(0.8);
                                img{width: 100%; height: 100%; object-fit: contain;}
                            }
                        }
                    }
                }
            }
        }
    }
    @media @max768 {
        .product_info_bottom .header_link .flexbox {padding: .5rem 0;
            .f_right{.f_column; .a_start; gap: 0;
        
            }
        }
    }
    @media @max480 {
        .product_info_top .flexbox .f_right .info .pro_operate .item{padding:.1rem .2rem;}
    }
}

/* --------------------------------------------------------------- 产品概述 */
.product_overview_banner{.f_center; width: 100%; height: auto; position: relative; z-index: 1; overflow: hidden; 
    .imgbg{

    }
    .info{.white; .center;width: 54%;position: absolute; z-index: 2;  top: .96rem;
        .main_desc{margin-top: .32rem;}
    }

}